<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8" name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no">
    <meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests">
    <title>{$tkd.title|parseTpl}</title>
    <meta name="keywords" content="{$tkd.keywords|parseTpl}">
    <meta name="description" content="{$tkd.description|parseTpl}">
	<link rel="stylesheet" href="{$kx.config.resurl}/template/kxmobileno1/css/global.css"/>
	<script src="{$kx.config.resurl}/template/kxmobileno1/js/flexible.min.js"></script>
    <link rel="shortcut icon" type="image/ico" href="/favicon.ico" />
    <meta name="author" content="www.ptcms.com">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
    <meta name="renderer" content="webkit">
    <meta name="viewport" content="width=device-width" />
    <meta name="applicable-device" content="pc">
    <meta http-equiv="mobile-agent" content="format=html5; url={$kx.config.mobileurl}__SELF__">
    <meta http-equiv="Cache-Control" content="no-siteapp" />
    <meta http-equiv="Cache-Control" content="no-transform" />
    <link rel="canonical" href="{$kx.config.pcurl}__SELF__" />
    <style>
		.pt-search-icon{
			width:0.21rem;
			height:0.21rem;
		}
		.pt-leave-comment{
			width:100vw;
			height:0.44rem;
			line-height: 0.44rem;
			text-align: center;
			background-color: #fff;
			position: fixed;
			left:0;
			bottom:0;
		}
		.pt-comment{
			padding-left:0.05rem;
			/*padding-bottom: 0.15rem;*/
			padding-top: 0.15rem;
		}
		.pt-comment-title{
			margin-left:0.10rem;
			margin-bottom: 0.15rem;
			padding-left:0.05rem;
			border-left:0.02rem solid #FF5555;
		}
		.pt-comment-icon{
			width:0.45rem;
			height:0.45rem;
			border-radius: 0.45rem;
		}
		.pt-comment-cont{
			padding-top: 0.15rem;
			padding-bottom: 0.2rem;
			border-bottom: 0.01rem solid #F2F2F7;
		}
	</style>
</head>
<body>
	<!-- 头部 -->
	<div class="w100  bg-white flex-wrp flex-align-center flex-between lh100 plr15 ptb15">
		<img src="{$kx.config.resurl}/template/kxmobileno1/images/return.png" class="pt-return">
		<div class="size18 bold color37">评论区-{$booklist.title}</div>

        <div>
            <img src="{$kx.config.resurl}/template/kxmobileno1/images/ellipsis.png" class="mr5 pt-ellipsis">
        </div>
        <div class="pt5 pb5 pt-tip">
            <a href="{link=index.index}" class="block color1 text-center pt-tip-item" title="{$kx.config.sitename}">前往首页</a>
            <a href="{link=user.booklist.detail}" class="block color1 text-center pt-tip-item">创建书单</a>
            <a href="{link=user.booklist.index}" class="block color1 text-center pt-tip-item">我的书单</a>
        </div>
	</div>

	<!-- 全部评论 -->
	<div class="w100 mb10 bg-white lh100 mt10 pt-comment">
		<div class="flex-wrp flex-between ">
			<div class="size14 color7 bold pt-comment-title">全部评论</div>
			<div class="size12 color4 mr15">当前共{$booklist.num_comment}条</div>
		</div>
        {block method="pagination" name="paginate" page=$page limit=$pageSize count=$booklist.num_comment maxpage=50 section=3}
        {block method="comment.list" name=commentlist type='booklist' typeid=$booklist.id userid=$userinfo.id num=$paginate.limit page=$paginate.current}
        {loop=commentlist}
        <div class="flex-wrp plr15 pt-comment-cont" data-comment-id="{$loop.id}">
            <img src="{$loop.user.avatar}" class="mr20 pt-comment-icon" alt="{$loop.name}">
            <div class="flex-item flex-wrp flex-cell flex-around">
                <div class="flex-wrp lh100 flex-between">
                    <div class="size14 color4">{$loop.name}</div>
                    <div class="size12 color4">{$loop.datetime|date="Y-m-d H:i:s"}</div>
                </div>
                <a href="{link=post booklistid=$booklist.id commentid=$loop.id}">
                    <div class="compulsory-row lh150 ptb10 size14 color32">{$loop.content}</div>
                </a>
                <div class="text-right lh100 comment-btn {$loop.rating|boolval|default='','disable'}">
                    <div class="inline-block comment-btn-up {=$loop.rating=='good'?'active':''}">
                        <img src="{$kx.config.resurl}/template/kxmobileno1/images/praise{=$loop.rating=='good'?'_hover':''}.png" alt="">
                        <span class="size12 color4 number">{$loop.good_num}</span>
                    </div>
                    <div class="inline-block comment-btn-down {=$loop.rating=='good'?'active':''}">
                        <img src="{$kx.config.resurl}/template/kxmobileno1/images/tread{=$loop.rating=='bad'?'_hover':''}.png" alt="">
                        <span class="size12 color4 number">{$loop.bad_num}</span>
                    </div>
                </div>
            </div>
        </div>
        {/loop}
	</div>
    {if $paginate.total > 1}
    <div class="flex-wrp flex-between bg-white ptb15 plr15 mt10" style="position: fixed;bottom: 0.44rem;width: 100%;">
        {if $paginate.first != $paginate.current}
        <div class="flex-wrp flex-around flex-center pt-page4">
            <a title="首页" href="{link=list booklistid=$booklist.id page=$paginate.first}">
                <span class="size14 color2">首页</span>
            </a>
        </div>
        {/if}
        {if $paginate.prev}
        <div class="flex-wrp flex-around flex-center pt-page4">
            <a href="{link=list booklistid=$booklist.id page=$paginate.prev}">
                <span class="size14 color2">上一页</span>
            </a>
        </div>
        {/if}
        {if $paginate.next}
        <div class="flex-wrp flex-around flex-center pt-page4">
            <a href="{link=list booklistid=$booklist.id page=$paginate.next}">
                <span class="size14 color2">下一页</span>
            </a>
        </div>
        {/if}
        {if $paginate.last != $paginate.current}
        <div class="flex-wrp flex-around flex-center pt-page4">
            <a href="{link=list booklistid=$booklist.id page=$paginate.last}">
                <span class="size14 color2">尾页</span>
            </a>
        </div>
        {/if}
    </div>
    {/if}
	<!-- 留言评论 -->
	<div class="size14 color2 pt-leave-comment">
		留言评论
	</div>
    <div class="pt-comment-box" style="display: none;">
        <div class="size18 bold color37 text-center">留言评论</div>
        <!-- 内容 -->
        <div class="pt-content" style="margin: 0.1rem;">
            <textarea class="pt-text" style="height: 1rem;width: 100%;padding:0.1rem;border-radius: 0.05rem" placeholder="请在此输入评论内容" ></textarea>
            <div class="size14 color92 pt-sum text-right"><span class="pt-num">0</span>/<span class="pt-limit">200</span></div>
        </div>
        <div class="bg-red size16 color1 pt-submit" style="height: 0.4rem;text-align: center;line-height:0.4rem;margin: 0 0.3rem 0.2rem;border-radius: 0.2rem">发表评论</div>
    </div>
    <script>var __RATING_COMMENT='{link=novel.comment.rating}',__TYPE='booklist',__TYPE_ID='{$booklist.id}',__ADD_COMMENT='{link=comment.add}';</script>
    <!-- 底部版权 -->
    {include file="/system/footer"}
    <script src="{$kx.config.resurl}/template/kxmobileno1/js/layer/mobile/layer.js"></script>
    <script src="{$kx.config.resurl}/template/kxmobileno1/js/comment.js"></script>
</body>
</html>